<template>
	<view class="flex-col page">
		<view class="flex-col group ">
			<view class="flex-col items-start">
				<view class="section_1 hearder-color">
					<view class="justify-between group_1">
						<text class="text" @click="switchIndex(0)">首页</text>
						<text class="text_1" @click="switchIndex(1)">我家总览</text>
					</view>
				</view>
				<view class="w-top">
					<u-swiper class="hearder-background" height="320" :list="list4" previousMargin="50" nextMargin="50"
						radius="15" circular>
					</u-swiper>

				</view>
			</view>
			<view class="flex-col section_5">
				<view class="justify-between" @click="go('/pages/index/tool', true)">
					<text class="text_2">常用工具</text>
					<view class=" u-flex u-col-center">
						<text class="text_3">更多</text>
						<!-- <u-icon name="arrow-right" size="24"></u-icon> -->
						<view class="text_3">></view>
					</view>

				</view>
				<view class="flex-row equal-division">
					<view class="flex-col items-start equal-division-item" @click="go('/pages/tool/estimate')">
						<text class="text_4">装修全费用</text>
						<text class="text_4 u-m-t-10">估算</text>
						<view class="section_6">
							<!--*-->
						</view>
					</view>
					<view class="flex-col items-start equal-division-item_1" @click="go('/pages/tool/forecast')">
						<text class="text_5">装修工期</text>
						<text class="text_5 u-m-t-10">测算</text>
						<view class="section_7">
							<!--*-->
						</view>
					</view>
				</view>
			</view>
			<view class="flex-col section_8">
				<text class="text_6">全流程服务</text>
				<view class="flex-col list">
      
					<view class="flex-row list-item" @click="go('/pages/index/vipservice')">
						<image :src="imgUrl + '16557826881033457547.png'" class="image_3" />
						<view class="flex-col items-start group_5">
							<text class="text_7">全流程咨询</text>
							<text class="text_9">设计优化+预结算审/合约+选材咨询+高级巡检</text>
						</view>
					</view>
					<view class="list-divider"></view>
					<view class="flex-row list-item" @click="go('/pages/index/housekeeper')">
						<image :src="imgUrl + '16557826880908855846.png'" class="image_3" />
						<view class="flex-col items-start group_5">
							<text class="text_7-1">全流程管家</text>
							<text class="text_9">全流程咨询范畴+代管工程并负责与设计、工长和供应商协调。</text>
						</view>
					</view>
				</view>
				<view class="flex-col group_7">
					<text class="text_13">单项服务</text>
					<view class="flex-row equal-division_1">
						<view class="flex-col items-center equal-division-item_2 group_8"
							@click="go('/pages/optimize/optimize')">
							<image :src="imgUrl + '16557826881739169713.png'" class="image_6" />
							<text class="text_14">设计优化</text>
						</view>
						<view class="flex-col items-center equal-division-item_2"
							@click="go('/pages/optimize/optimizes')">
							<image :src="imgUrl + '16557847845088713273.png'" class="image_6" />
							<text class="text_14">预算合约</text>
						</view>
						<view class="flex-col items-center equal-division-item_2" @click="showCousult">
							<image :src="imgUrl + '16557826893038297307.png'" class="image_6" />
							<text class="text_14">主材咨询</text>
						</view>
						<view class="flex-col items-center equal-division-item_2"
							@click="go('/pages/optimize/shigongxunjian')">
							<image :src="imgUrl + '16557826893716441652.png'" class="image_6" />
							<text class="text_14">施工巡检</text>
						</view>
						<view class="flex-col items-center equal-division-item_2"
							@click="go('/pages/index/checkservice/checkservice')">
							<image :src="imgUrl + '16557826894388376419.png'" class="image_6" />
							<text class="text_14">验收服务</text>
						</view>
					</view>
				</view>
			</view>


			<view class="flex-col section_9">
				<view class="group_13">
					<text class="text_20">装一个高品质家的</text>
					<text class="text_21">五大步骤</text>
				</view>
				<view class="flex-row group_14">
					<view class="flex-col group_15">
						<u-swiper style="margin-left: -40px;" height="320" previousMargin="60" nextMargin="50"
							:list="list1" :autoplay="false" circular radius="15" bgColor="#ffff"
							@click="go('/pages/index/works')"></u-swiper>
					</view>
				</view>
			</view>
		</view>
		<shop-consult v-if="show" @close="close" style="margin-bottom: 45px;"></shop-consult>
	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
			list1: [
			
				'https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557826894437055469.png',
				'https://cdn.uviewui.com/uview/swiper/swiper3.png',
				'https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557826894437055469.png',
			
			],
				imgUrl:this.$IMG_URL,
				list3: [

				],
				list4: [],
				id: '',
				address: '',
				show: false
			};
		},
		
		created() {
			this.getSwiper();
			console.log();
		},
		methods: {
			getSwiper() { //获取轮播图
				this.$http('queryCarousel').then(r => {
					if (r.code == 200) {
						let arr = [];
						r.data.map(item => {
							arr.push(item.address);
						})
						this.list4 = arr;

					}
				})
			},
			showCousult() {
				this.show = true;
			},
			close() {
				this.show = false;
			},
			clickItem(list4) {

				console.log(list4)
			},
		},
	};
</script>

<style scoped lang="scss">
	.group_17 {
		height: 76rpx;
	}

	.image_15 {
		width: 54rpx;
		height: 54rpx;
	}

	.image {
		border-radius: 16rpx;
		width: 660rpx;
		height: 320rpx;
	}

	.list-item {
		padding: 31rpx 24rpx 31rpx;
	}

	.section_3 {
		background-color: #ffffff80;
		border-radius: 2rpx;
		width: 28rpx;
		height: 4rpx;
	}

	.image_3 {
		flex-shrink: 0;
		width: 96rpx;
		height: 96rpx;
	}

	.group_5 {
		margin-left: 20.5rpx;
		margin-bottom: 8rpx;
		flex: 1 1 auto;
	}

	.equal-division-item_2 {
		margin-left: 9rpx;
		flex: 1 1 143rpx;
		padding: 10rpx 0;
	}

	.text_7 {
		margin-left: 11rpx;
		color: #fd7b0b;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		font-weight: bold;
		letter-spacing: 1rpx;
	}

	.text_7-1 {
		margin-left: 11rpx;
		color: #1D6AFF;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		font-weight: bold;
		letter-spacing: 1rpx;
	}

	.text_9 {
		margin-top: 23rpx;
		margin-left: 10rpx;
		color: #666666;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
	}

	.image_6 {
		width: 64rpx;
		height: 64rpx;
	}

	.text_14 {
		margin-top: 24rpx;
		color: #191919;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.page {
		background-color: #f6f7f9;
		width: 100%;
		overflow-y: auto;
		overflow-x: hidden;
		height: 100%;
	}

	.group {
		flex: 1 1 auto;
		overflow-y: auto;
	}

	.tab-bar {
		padding: 6rpx 98rpx 16rpx;
		background-color: #ffffff;
		box-shadow: 0px -1rpx 0px 0px #eeeeee;
	}

	.section_1 {
		padding-top: 0rpx;
		background-color: #e4edfc;
		background-image: linear-gradient(to right, #DBF1F9 10%, #e9edfc 60%, #DBF1F9);
		background-position: 0% 0%;
		background-size: 100% 100%;
		background-repeat: no-repeat;
		width: 100%;
	}

	.hearder-color {
		position: fixed;
		z-index: 1;
		width: 100%;
		height: 170rpx;
	}

	.section_2 {
		padding-top: 0rpx;
		background-color: #e5f5fdff;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557826856235205509.png');

		width: 100%;
	}

	.section_5 {
		padding: 60rpx 25rpx 32rpx 32rpx;
		background-color: #ffffffff;
	}

	.w-top {
		margin-top: 170rpx;
		width: 100%;
	}

	.hearder-background {
		background-image: linear-gradient(to bottom, #dbf1f9, #E2EDFB, #ffffff);
		width: 100vw;
		height: 43vw;
	}

	.section_8 {
		margin-top: 20rpx;
		padding-top: 37rpx;
		background-color: #ffffffff;
	}

	.section_9 {
		margin-top: 20rpx;
		padding: 37rpx 0 44rpx 39rpx;
		background-color: #ffffffff;
	}

	.group_1 {
		margin-left: 40rpx;
		width: 280rpx;
	}

	.group_2 {
		margin-left: -634rpx;
		margin-top: 50rpx;
		width: 2018rpx;
	}

	.equal-division {
		margin-top: 42rpx;
	}

	.text_6 {
		margin-left: 33rpx;
		align-self: flex-start;
		color: #000000;
		font-size: 34rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 40rpx;
	}

	.list {
		margin: 43rpx 32rpx 0;
		background-color: #F4F9FD;
		border-radius: 20rpx;
	}

	.group_7 {
		padding: 53rpx 0 46rpx;
	}

	.group_13 {
		align-self: flex-start;
	}

	.group_14 {
		margin-top: 33rpx;
		padding-left: 11rpx;
	}

	.text_25 {
		color: #1d6aff;
		font-size: 20rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 23rpx;
	}

	.text_26 {
		color: #000000;
		font-size: 20rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 23rpx;
	}

	.text_27 {
		color: #000000;
		font-size: 20rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 23rpx;
	}

	.text {
		margin-top: 70rpx;
		color: #000000;
		font-size: 50rpx;
		letter-spacing: 2rpx;
		font-family: '.AppleSystemUIFont';
		font-weight: bold;
	}

	.text_1 {
		margin-top: 70rpx;
		align-self: center;
		color: #000000;
		font-size: 35rpx;
		font-family: '.AppleSystemUIFont';
	}

	.section_2 {
		margin-left: 24rpx;
		padding: 291rpx 40rpx 25rpx;
		border-radius: 16rpx;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557826864255386724.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		height: 320rpx;
	}

	.image_2 {
		margin-left: 24rpx;
	}

	.text_2 {
		color: #000000;
		font-size: 36rpx;
		font-family: '.AppleSystemUIFont';
		letter-spacing: 3rpx;
	}

	.text_3 {
		margin-right: 5rpx;
		color: #999999;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.equal-division-item {
		padding: 26rpx 24rpx 32rpx;
		flex: 1 1 332rpx;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557826875404103802.png');
		background-position: 0% 0%;
		background-size: 100% 100%;
		background-repeat: no-repeat;
		height: 180rpx;
	}

	.equal-division-item_1 {
		margin-left: 29rpx;
		padding: 26rpx 25rpx 32rpx;
		flex: 1 1 332rpx;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557826875571446376.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		height: 180rpx;
	}

	.list-divider {
		margin-right: 24rpx;
		align-self: flex-end;
		background-color: #e0dfdf;
		width: 510rpx;
		height: 1rpx;
	}

	.text_13 {
		margin-left: 32rpx;
		align-self: flex-start;
		color: #000000;
		font-size: 34rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 40rpx;
	}

	.equal-division_1 {
		margin-top: 41rpx;
		padding: 0 16.5rpx;
	}

	.text_20 {
		color: #000000;
		font-size: 34rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 40rpx;
	}

	.text_21 {
		color: #666666;
		font-size: 34rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 40rpx;
	}

	.group_15 {
		margin-bottom: 4rpx;
		padding-top: 10rpx;
		flex: 1 1 668rpx;
		position: relative;
	}

	.image_14 {
		margin: 14rpx -634rpx 0 6rpx;
		flex: 1 1 668rpx;
	}

	.view {
		margin-left: 461rpx;
	}

	.section_4 {
		margin-left: 13rpx;
		background-color: #ffffff;
		border-radius: 2rpx;
		width: 28rpx;
		height: 4rpx;
	}

	.view_1 {
		margin-left: 12rpx;
	}

	.text_4 {
		color: #1D6AFF;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		letter-spacing: 2rpx;
		line-height: 33rpx;
		text-align: left;
		font-weight: Bold;
	}

	.section_6 {
		margin-top: 41rpx;
		background-image: linear-gradient(90deg, #1c62f9 0%, #1c62f9 0%, #1c62f900 100%, #1c62f900 100%);
		width: 64rpx;
		height: 10rpx;
	}

	.text_5 {
		color: #ab39d5;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		letter-spacing: 2rpx;
		line-height: 33rpx;
		text-align: left;
		font-weight: bold;
	}

	.section_7 {
		margin-top: 41rpx;
		background-image: linear-gradient(90deg, #ab39d5 0%, #ab39d5 0%, #ab39d500 100%, #ab39d500 100%);
		width: 64rpx;
		height: 10rpx;
	}

	.group_8 {
		margin-left: 0;
	}

	.section_10 {
		margin-right: 18rpx;
		padding: 31rpx 32rpx 24rpx;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557826894437055469.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
	}

	.section_11 {
		padding: 11rpx 0 20rpx;
		border-radius: 50%;
		filter: drop-shadow(0px 3rpx 3rpx #1c5edd4d);
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557826908808176901.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		width: 120rpx;
		height: 120rpx;
		position: fixed;
		right: 20rpx;
		bottom: 260rpx;
		z-index: 1000;
	}

	.image_12 {
		margin-top: 206rpx;
		align-self: center;
		width: 108rpx;
		height: 10rpx;
	}

	.image_13 {
		width: 40rpx;
		height: 39rpx;
	}

	.text_24 {
		margin-top: 2rpx;
		color: #ffffff;
		font-size: 16rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 18rpx;
	}

	.text-wrapper {
		padding: 4rpx 0 14rpx;
		background-image: linear-gradient(107.8deg, #3d999f 0%, #3d999f -4.12%, #63b040 99.99%, #63b040 100%);
		border-radius: 24rpx;
		width: 108rpx;
		height: 48rpx;
	}

	.text_23 {
		margin-left: 23rpx;
		color: #ffffff;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 38rpx;
		text-shadow: 0px 3rpx 6rpx #00000029;
	}

	.text_22 {
		color: #ffffff;
		font-size: 26rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 30rpx;
	}
</style>
